<template>
  <h1>日期时间选择器组件</h1>
  <el-date-picker
      type="date"
      v-model="rq"
      placeholder="请选择出发日期"
  @change="console.log(rq)"
  format="YYYY/MM/DD"
  value-format="YYYY-MM-DD">
  </el-date-picker>
  <el-date-picker
      type="datetime"
      v-model="sj"
      placeholder="请选择出发时间"
      @change="console.log(sj)"
      format="YYYY/MM/DD/hh:mm:ss"
      value-format="YYYY-MM-DD hh:mm:ss">
  </el-date-picker>
  <el-date-picker
      type="datetimerange"
      v-model="times"
      placeholder="请选择起止时间"
      @change="console.log(times)"
      format="YYYY/MM/DD/hh:mm:ss"
      value-format="YYYY-MM-DD hh:mm:ss"
      range-separator="到"
      >
  </el-date-picker>
</template>

<script setup>
import {ref} from "vue";

const rq=ref('')
const sj=ref('')
const times=ref([])
</script>

<style scoped>

</style>